<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>物品审批</title>
    <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
    <meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">

    <link rel="shortcut icon" href="favicon.ico">
    <link href="css/bootstrap.min.css-v=3.3.5.css"
          tppabs="http://www.zi-han.net/theme/hplus/css/bootstrap.min.css?v=3.3.5" rel="stylesheet">
    <link href="css/font-awesome.min.css-v=4.4.0.css"
          tppabs="http://www.zi-han.net/theme/hplus/css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
    <link href="css/plugins/iCheck/custom.css"
          tppabs="http://www.zi-han.net/theme/hplus/css/plugins/iCheck/custom.css" rel="stylesheet">
    <link href="css/animate.min.css" tppabs="http://www.zi-han.net/theme/hplus/css/animate.min.css"
          rel="stylesheet">
    <link href="css/style.min.css-v=4.0.0.css" tppabs="http://www.zi-han.net/theme/hplus/css/style.min.css?v=4.0.0"
          rel="stylesheet">
    <!--    <base target="_blank">-->
    <link rel="stylesheet" type="text/css" href="./layui/css/layui.css"/>
    <style>
        #zhuti {
            height: 100%;

        }

        #zhuti::before {
            background: url('img/lg.jpg') no-repeat fixed center;
            background-size: 300px;
            content: "";
            opacity: 0.2;
            /*透明度设置*/
            width: 80%;
            height: 80%;
            position: absolute;
        }

        #xiaohuiid {
            border-top: 0;
            padding-left: 20px;
            height: 360px;
            background-color: #fff;
            margin-right: -15px;
            margin-left: -15px;
        }
    </style>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">

    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins" id="zhuti">
                <div class="ibox-title">
                    <h3 style="font-weight: 600;margin-top: 0;">申请详情</h3>
                    <button onclick="correctExport()" class="btn-info" style="float: right;">导出Word</button>
                    <form action="/user/exportWord" class="word_form" method="post" style="display: none">
                        <input name="fid" class="word_input" type="text"/>
                        <input class="word_submit" type="submit"/>
                    </form>
                </div>

                <div class="ibox-content">
                    <!--                    upd意思为取消只读-->
                    <div method="post" id="bigform" autocomplete="off" class="form-horizontal">
                        <div id="thing">

                        </div>


                        <div class="form-group">
                            <label class="col-sm-2 control-label">归还人员</label>
                            <div class="col-sm-3">
                                <input id="ghry" type="text" name="fuzeren" required placeholder="请输入归还人姓名"
                                       class="form-control upd">
                            </div>

                            <label class="col-sm-2 control-label">校园卡号</label>
                            <div class="col-sm-4">
                                <input id="xykh" type="text" name="campusid" required placeholder="请输入归还人校园卡号"
                                       class="form-control upd">
                            </div>
                        </div>

                        <div class="form-group">

                            <label class="col-sm-2 control-label">联系方式</label>
                            <div class="col-sm-3">
                                <input id="lxfs" type="text" name="phoneid" required placeholder="请输入归还人联系电话"
                                       class="form-control upd">
                            </div>
                        </div>


                        <div class="form-group">
                            <label class="col-sm-2 control-label">所有借用物品编号</label>
                            <div class="col-sm-3">
                                <input id="allSigns" readonly="readonly" type="text"  required placeholder=""
                                       class="form-control upd">
                            </div>

                            <label class="col-sm-2 control-label">已归还物品编号</label>
                            <div class="col-sm-4">
                                <input id="alreadyReturnSigns" readonly="readonly" type="text"  required placeholder=""
                                       class="form-control upd">
                            </div>
                        </div>


                        <div class="form-group">
                            <label class="col-sm-2 control-label">未归还物品编号</label>
                            <div class="col-sm-3">
                                <input id="notReturnSigns" readonly="readonly" type="text"  required placeholder=""
                                       class="form-control upd">
                            </div>

                            <label class="col-sm-2 control-label">归还物品编号</label>
                            <div class="col-sm-4">
<!--                                <input id="returnSigns" type="textarea"  required placeholder="请输入归还的物品编号"-->
<!--                                       class="form-control upd">-->
                                <textarea name="" id="returnSigns" cols="30" rows="1" class="form-control upd"
                                          required placeholder="请输入归还的物品编号" style="font-size: 20px"></textarea>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label">值班人员</label>
                            <div class="col-sm-3">
                                <input id="zbry" type="text" name="fuzeren" required placeholder="请输入值班人姓名"
                                       class="form-control upd">
                            </div>

                            <label class="col-sm-2 control-label">归还备注</label>
                            <div class="col-sm-4">
                                <input type="text" name="outtime" required placeholder="请输入归还备注"
                                       class="form-control"
                                       id="ghbz">
                            </div>
                        </div>

                        <form class="layui-form" action="#" onsubmit="return false;">
                            <div class="form-group">
                                <label class="col-sm-2 control-label">是否损坏</label>

                                <div class="col-sm-3">
                                    <input style="margin-left: 15px" type="checkbox" name="gongan" lay-skin="switch" lay-filter="switchTest1"
                                           lay-text="是|否" class="form-control">
                                </div>
                            </div>

                            <div class="form-group" style="display:none" zone="100" id="sunhuai">
                                <label class="col-sm-2 control-label">损坏情况</label>
                                <div class="col-sm-3">
                                    <input type="text" name="demageDetail" placeholder="请输入损坏情况"
                                           class="form-control size">
                                </div>
                            </div>
                        </form>




                        <div class="hr-line-dashed"></div>
                        <div class="form-group" id="tjj">
                            <div id='pycg' class="col-sm-3 col-sm-offset-4">
                                <div>
                                    <input onclick='sy()' type='submit' style="margin-right: 40%;" id="tijiao"
                                           class="btn btn-primary"
                                           value="归还">

<!--                                    <input  onclick='qx()' type='submit' style="margin-right: 40%;" id="quxiao"-->
<!--                                            class="btn btn-primary"-->
<!--                                            value="取消活动">-->
                                </div>
                                <a target="_self" href="showActivity.html">
                                    <input
                                            class="btn btn-info"
                                            value="返回">
                                </a>
                            </div>
                        </div>

                    </div>
                </div>
                <script src="./layui/layui.js" type="text/javascript" charset="utf-8"></script>
                <script src="js/jquery.min.js-v=2.1.4"
                        tppabs="http://www.zi-han.net/theme/hplus/js/jquery.min.js?v=2.1.4"></script>
                <script src="layui/layer/layer.js" type="text/javascript" charset="utf-8"></script>
                <script type="text/javascript">//----layui框架

                let id = 0;
                let state = "";
                let st = ''
                let et = ''
                let fid=''
                let count=0;



                //页面入口函数
                $(document).ready(function ab() {
                    let x=GetRequest();
                    fid=x.fid

                    // console.log("!!!!"+fid)
                    getDetail()

                    layui.use('form', function () {
                        var form = layui.form;
                        //公安
                        form.on('switch(switchTest1)', function (data) {
                            // console.log(data.elem.checked);
                            var ll = layui.$("input[name='gongan']").is(':checked');
                            // layui.$(test).is(':checked');
                            if (data.elem.checked == false && $.trim(ll) == $.trim('true')) {
                                document.getElementById('sunhuai').style.display = 'none';
                            } else if (data.elem.checked == true && $.trim(ll) == $.trim('true')) {
                                document.getElementById('sunhuai').style.display = 'block';
                            } else if (data.elem.checked == false && $.trim(ll) == $.trim('false')) {
                                document.getElementById('sunhuai').style.display = 'none';
                            } else {
                                document.getElementById('sunhuai').style.display = 'none';
                            }
                            ;
                        });
                    });
                });
                <!--  导出word -->
                function correctExport()
                {
                    $(".word_input").val(fid);
                    $(".word_form").submit();
                    //
                }
                //归还
                function sy() {
                    let ghry=$('#ghry').val()
                    let lxfs=$('#lxfs').val()
                    let zbry=$('#zbry').val()
                    let ghbz=$('#ghbz').val()
                    let xykh=$('#xykh').val()


                    let returnSigns=$('#returnSigns').val()

                    //损坏信息
                    let isdamage=0;
                    let damageDetail=$("demageDetail").val();
                    if (damageDetail==""){
                        isdamage=0;
                    }else {
                        isdamage=1;
                    }

                    let list = $('input')
                    let btList=[];
                    // console.log(list)
                    console.log(list.length);
                    //num---借出总数
                    //acnum--实际归还
                    for(let i=2;i<2+count;i++){
                        // console.log(list[i].attributes[3].value)
                        // console.log(list[i].value)
                        let id=list[i].attributes[0].value;
                        let sid=list[i].attributes[1].value;
                        let num=list[i].attributes[2].value;
                        let acnum0=list[i].attributes[3].value;

                        //输入数量
                        let acnum=list[i].value;
                        // let badnum=list[i].attributes[3].value;
                        // console.log(acnum0)
                        let badnum=0;
                        if(num==acnum0){
                            badnum=num-acnum
                        }else{
                            badnum=(num-acnum0)-acnum
                            // console.log(badnum)
                        }
                        let item={fid,sid,num,acnum,badnum,id}
                        btList.push(item)
                    }
                    console.log(btList)
                    console.log("!!!!")
                    console.log(returnSigns)
                    // console.log(fid,ghry,lxfs,zbry,ghbz)
                    let data={
                        aid: parseInt(fid),
                        name: ghry,
                        tel: lxfs,
                        dutyPerson: zbry,
                        mes: ghbz,
                        signs:returnSigns,
                        isDamaged:isdamage,
                        damage:damageDetail,
                        no:xykh,

                        'borrowThingList':btList,

                    }
                    // console.log(data)
                    $.ajax({
                        type: "POST",
                        url: "/user/inStock",
                        contentType:'application/json',
                        data:JSON.stringify(data),
                        success: function (msg) {
                            $("#tijiao").css("visibility","hidden");
                            $("#quxiao").css("visibility","hidden");
                            // $('#tijiao').hide();
                            // console.log(msg);

                            if(msg==='提交数据有误！'||msg==='请输入入库物品编号！'||msg==='物品编号存在错误！'){
                                // layui.layer.alert('正常弹出下载');
                                layui.layer.alert(msg);
                                $("#tijiao").css("visibility","visible");
                                $("#quxiao").css("visibility","visible");
                            }else if(msg==='操作成功！'||msg==='物品已全部归还！'){
                                layui.layer.alert(msg);
                                window.location.href='./showActivity.html';
                            }


                        }
                    });
                }


                // //取消活动
                // function qx(){
                //     $.ajax({
                //         type: "GET",
                //         url: "/user/cancelAct",
                //         data:{
                //             "id":fid
                //         },
                //         success: function (msg) {
                //             alert("!!!!!!"+msg)
                //             layer.alert(msg);
                //             if (msg==='取消成功'){
                //                 $("#tijiao").css("visibility","hidden");
                //                 $("#quxiao").css("visibility","hidden");
                //                 layer.alert(msg);
                //                 window.location.href='./showActivity.html';
                //             }else {
                //                 layer.alert(msg);
                //             }
                //         }
                //     });
                // }


                //拒绝
                function sy2() {
                    let app=$('#spr').val();
                    // let xx = "审批通过";
                    $.ajax({
                        type: "POST",
                        url: "admin/doBorrowThingApply",
                        data: {
                            fid: 22,
                            approver: app,
                            mark:'0'
                        },
                        success: function (msg) {
                            $('#tijiao').hide()
                            $('#reset1').hide()
                            // console.log(msg);
                            layer.alert(msg);
                        }
                    });
                }

                <!--	获取url后边的参数-->
                function GetRequest() {
                    const url = location.search; //获取url中"?"符后的字串
                    let theRequest = new Object();
                    if (url.indexOf("?") != -1) {
                        let str = url.substr(1);
                        let strs = str.split("&");
                        for (let i = 0; i < strs.length; i++) {
                            theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
                        }
                    }
                    return theRequest;
                }

                //分组
                function classify(arr){
                    let map = {};
                    let myArr = [];
                    for(let i = 0; i < arr.length; i++){
                        if(!map[arr[i].name]){
                            myArr.push({
                                name:arr[i].name,
                                data:[arr[i]]
                                // id: arr[i].id,
                                // data: [arr[i]]
                            });
                            map[arr[i].name] = arr[i]
                        } else {
                            for(let j = 0; j < myArr.length; j++){
                                if(arr[i].name === myArr[j].name){
                                    myArr[j].data.push(arr[i]);
                                    break
                                }
                            }
                        }
                    }
                    return myArr
                }

                //获取申请详情
                function getDetail() {
                    $.ajax({
                        type: "GET",
                        url: "user/getActById",
                        data: {
                            id: fid
                        },
                        success: function (msg) {
                            // console.log(msg);
                            // alert(msg)
                            let list=msg.list
                            // console.log(classify(list))
                            addThings(classify(list))
                            filling(msg.activity)
                            console.log("!!!"+list)
                            console.log(msg)
                        }
                    });
                }

                //填写底部输入框信息
                function filling(msg) {

                    console.log(msg)
                    $('#allSigns').val(msg.allThings);
                    $('#notReturnSigns').val(msg.unReturnThings);
                    $('#alreadyReturnSigns').val(msg.returnedThings);
                }

                //动态添加物品及数量
                function addThings(msg) {
                    // console.log(msg)
                    // for (let i = 0; i < msg.length; i++) {
                    //     addName(msg[i].name)
                    //     let content = '<div class="form-group">'
                    //     let list = msg[i].data;
                    //     // console.log(list);
                    //     for (let j = 0; j < list.length; j++) {
                    //         //显示数量
                    //         let xsNum=0;
                    //         if(list[j].acNum==list[j].num){
                    //             xsNum=list[j].num;
                    //         }else{
                    //             xsNum=list[j].badNum;
                    //         }
                    //         content += addSize(list[j].size, xsNum,list[j].sId,list[j].num,list[j].acNum,list[j].badNum,list[j].id)
                    //         count=count+1;
                    //     }
                    //     content = content + '</div>';
                    //     $('#thing').append(content);
                    // }

                    for (let i = 0; i < msg.length; i++) {
                        addName(msg[i].name)
                        let content = '<div class="form-group">'
                        let list = msg[i].data;
                        // console.log(list);
                        for (let j = 0; j < list.length; j++) {
                            content += addSize(list[j].size, list[j].num)
                        }
                        content = content + '</div>';
                        $('#thing').append(content);
                    }
                    addName('具体信息')
                }

                //添加一个物品名称
                function addName(name) {
                    let nameString = '<div class="ibox-title">\n' +
                            '                            <h3 style="font-weight: 600;margin-top: 0;padding-right: 500px;">\n' +
                            '                                ' + name + ':</h3>\n' +
                            '                        </div>'
                    $('#thing').append(nameString);
                }

                //添加物品的一个规格
                function addSize(size, number,sId,num,acNum,badNum,id) {
                    let item = ' <label class="col-sm-3 control-label">' + size + ':</label>\n' +
                            '                            <div class="col-sm-2 row" style="margin-bottom: 14px;">\n' +
                            '                                <input disabled="disabled" data-id='+id+' data-sid='+sId+' data-num='+num+' data-acnum='+acNum+' data-badnum='+badNum+' max='+number+' value='+number+' type="number" class="form-control">\n' +
                            '                            </div>'
                    return item;
                }

                </script>
                <script src="js/bootstrap.min.js-v=3.3.5"
                        tppabs="http://www.zi-han.net/theme/hplus/js/bootstrap.min.js?v=3.3.5"></script>
                <script src="js/content.min.js-v=1.0.0"
                        tppabs="http://www.zi-han.net/theme/hplus/js/content.min.js?v=1.0.0"></script>
                <script src="js/plugins/iCheck/icheck.min.js"
                        tppabs="http://www.zi-han.net/theme/hplus/js/plugins/iCheck/icheck.min.js"></script>
                <script type="text/javascript" src="../../../tajs.qq.com/stats-sId=9051096"
                        tppabs="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
            </div>
        </div>
    </div>
</div>
</body>

</html>
